<style>
  * {
    padding: 0px;
    margin: 0px;
  }
  ul {
    list-style: none;
    width: 300px;
    height: 50px;
    background-color: #ccc;
    overflow: hidden;
  }
  li {
    width: 300px;
    height: 50px;
    color: #fff;
    font-size: 20px;
    background-color: #000;
  }
</style>
<ul>
  <li id="first" style="margin-top: 0px">001</li>
  <li>002</li>
  <li>003</li>
  <li>001</li>
</ul>

<script>
  setInterval(function () {
    var liObj = document.querySelector("li:nth-child(1)");
    var marginTop = liObj.style.marginTop.replace("px", "");
    marginTop--;
    if (marginTop == -150) marginTop = 0;
    liObj.style.marginTop = marginTop + "px";
  }, 30);
</script>
